<template>
    <div>
        <div class="sys-setting-panel">
            <el-form ref="formDataRef" :model="formData" :rules="rules" label-width="140px" @submit.prevent>
                <!-- 邮件的标题 -->
                <el-form-item label="注册邮件的标题" prop="registerEmailTitle">
                    <el-input v-model.trim="formData.registerEmailTitle" placeholder="请输入注册验证码邮件的标题" clearable ></el-input>
                </el-form-item>
                <!-- 邮件的内容 -->
                <el-form-item label="注册邮件的内容" prop="registerEmailContent">
                    <el-input v-model.trim="formData.registerEmailContent" placeholder="请输入注册验证码邮件的内容" clearable ></el-input>
                </el-form-item>
                <!-- 注册账号的初始空间大小 -->
                <el-form-item label="初始空间大小" prop="userInitUseSpace">
                    <el-input v-model.trim="formData.userInitUseSpace" placeholder="请输入初始空间大小" clearable ></el-input>
                </el-form-item>
                <!-- 提交 -->
                <el-form-item>
                    <el-button type="primary" @click="saveSetting">保存</el-button>
                </el-form-item>
            </el-form>
        </div>
    </div>
</template>
<script setup>
import { ref, reactive, getCurrentInstance, nextTick, onMounted, computed } from "vue";
const { proxy } = getCurrentInstance();

const api = {
    getSysSettings: "/admin/getSysSettings",   //获取系统设置
    saveSysSettings: "/admin/saveSysSettings", //修改系统设置
};

const rules = {    //根据form表单中的prop属性进行选择校验（proxy.Verify已在main.js中声明）
    registerEmailTitle: [{ required: true, message:"请输入注册验证码邮件的标题" }],
    registerEmailContent: [{ required: true, message:"请输入注册验证码邮件的内容" }],
    useInitUseSpace: [
        { required: true, message:"请输入初始空间大小" },
        { validator: proxy.Verify.number, message:"空间大小只能为数字" },
    ],
};

const formData = ref({});
const formDataRef = ref();


/**
 * 获取系统设置
 */
const getSysSettings = async () => {
    let result = await proxy.Request({
        url: api.getSysSettings,
    });
    if (!result) {
        return;
    }
    formData.value = result.data.sysSettingsDto;
};
getSysSettings();    //调用


/**
 * 保存系统设置
 */
const saveSetting = async () =>{
    formDataRef.value.validate(async (valid) => {
        if (!valid) {
            return;    //校验不通过则直接返回
        }
        let params = {};
        Object.assign(params, formData.value);  //将表单对象的值复制到params中
        let result = await proxy.Request({
            url: api.saveSysSettings,
            params: params,
        });
        if (!result) {
            return;
        }
        proxy.Message.success("保存成功");
    })
}

</script>
<style lang="scss" scoped>

</style>